<!--div class="container"-->
	<form method="post" id="formuser" action="#" enctype="multipart/form-data" class="form-horizontal" role="form" onsubmit="return cekDulu(this);">
	<div class="col-md-offset-1">
        <div class="col-md-11">
            <div class="panel panel-default">
                <div class="panel-heading">
					<h4 class="panel-title"><b class="caret"></b><b> Form - Add Room</b></h4>
				</div>
				<div class="panel-body">					
					<div class="col-sm-8">
						<div class="col-sm-4"><label for="l_room" class="control-label">Room Name<span style="color:red;">*</span></label></div>
						<div class="col-sm-4"><input type="text" class="form-control input-sm required" id="room" name="room" maxlength="30"></div>
					</div>
					<div class="col-sm-8">
						<div class="col-sm-4"><label for="l_type" class="control-label">Type Name<span style="color:red;">*</span></label></div>
						<div class="col-sm-4">
							<select name="type" id="type" class="form-control input-sm required"  onchange="ubahType(this);">
							<?php
								foreach($type_select as $type_select => $key)
								{
									echo '<option value="'.$key['MST_TYPE_ID'].'">'.$key['MST_TYPE_DESC'].'</option>';
								}
							 ?>
								<option value="Others">Others</option>
							</select>
						</div>
						<div class="col-sm-4">
							<input type="text" class="form-control input-sm" id="p_type" name="p_type" maxlength="25" style="visibility:hidden;" />
						</div>										
					</div>
					<div class="col-sm-8">
						<div class="col-sm-4"><label for="l_floor" class="control-label">Floor<span style="color:red;">*</span></label></div>
						<div class="col-sm-3">
							<select name="floor" id="floor" class="form-control input-sm required"  onchange="ubahFloor(this);">
							<?php
								foreach($floor_select as $floor_select => $key)
								{
									echo '<option value="'.$key['MST_FLOOR_DESC'].'">'.$key['MST_FLOOR_DESC'].'</option>';
								}
							?>
								<option value="Others">Others</option>
							</select>
						</div>
						<div class="col-sm-4">	
							<input type="text" class="form-control input-sm" id="p_floor" name="p_floor" maxlength="10" style="visibility:hidden;" />
						</div>
					</div>
					<div class="col-sm-8">
						<div class="col-sm-4"><label for="l_status" class="control-label">Status<span style="color:red;">*</span></label></div>
						<div class="col-sm-3">
							<select name="status" id="status" class="form-control input-sm required">
								<option value="Y">Active</option>
								<option value="N">Not Active</option>						
							</select>
						</div>
					</div>
					<div class="col-sm-8">
						<div class="col-sm-4"><label for="l_capacity" class="control-label">Room Capacity<span style="color:red;">*</span></label></div>
						<div class="col-sm-3"><input type="text" class="form-control input-sm required" id="capacity" name="capacity" value="0"></div>
					</div>
					<div class="col-sm-8" style="padding-bottom: 10px;">
						<div class="col-sm-4">
							&nbsp;
						</div>
					</div>
					<div class="col-sm-8">
						<div class="col-sm-4"><label for="button" class="control-label">&nbsp;</label></div>
						<div class="col-sm-4">
							<button type="submit" class="btn btn-success btn-block">
							<!--span class="glyphicon glyphicon-saved"></span--> Save Add</button>
						</div>
						<div class="col-sm-4">
							<button type="button" class="btn btn-default btn-block" onclick="cancel();">
							<!--span class="glyphicon glyphicon-circle-arrow-left"></span--> Cancel</button>
						</div>
					</div>
				</div>
			</div>
        </div>
    </div>
	</form>	
<!--/div-->	
<!--div style="margin-top:20px;"></div-->

<script type="text/javascript">
    $.validator.setDefaults({
        submitHandler: function() {
            $.post("<?= site_url() ?>setup/insert_room", {
                room: $('#room').val(),
                type: $('#type').val(),
				p_type: $('#p_type').val(),
				floor: $('#floor').val(),
				p_floor: $('#p_floor').val(),
				status: $('#status').val(),
				capacity: $('#capacity').val() 							
            },
            function(data) {
                window.location = '<?php echo base_url();?>setup/room';
            });
        }
    });

    $(document).ready(function() {
        $("#formuser").keypress(function(e) {
            if ((e.which && e.which == 13) || (e.keyCode && e.keyCode == 13)) {
                $.validator.setDefaults({
                    submitHandler: function() {
                        $.post("<?= site_url() ?>setup/insert_room", {
                            room: $('#room').val(),
							type: $('#type').val(),
							p_type: $('#p_type').val(),
							floor: $('#floor').val(),
							p_floor: $('#p_floor').val(),
							status: $('#status').val(),
							capacity: $('#capacity').val() 
                        },
                        function(data) {
                            window.location = '<?php echo base_url();?>setup/room';
                        });
                    }
                });
            }
        });

        $("#formuser").validate();
    });

    function cancel() {
        $.post("<?= site_url() ?>setup/result_room", function(data) {
            window.location = '<?php echo base_url();?>setup/room';
        });
    }

	function ubahType(elm) {
		elm.form.elements['p_type'].style.visibility=elm.value=='Others'?'visible':'hidden';
	}
	
	function ubahFloor(elm) {
		elm.form.elements['p_floor'].style.visibility=elm.value=='Others'?'visible':'hidden';
	}
	
	function cekDulu(frm) {
		if (frm.elements['room'].value.length==0) {
			frm.elements['room'].focus();
			alert('Isi Room Name nya');
			return false;
		}
		if (frm.elements['type'].value=='Others'&&frm.elements['p_type'].value.length==0) {
			frm.elements['p_type'].focus();
			alert('Isi Type Name nya');
			return false;
		}		
		if (frm.elements['floor'].value=='Others'&&frm.elements['p_floor'].value.length==0) {
			frm.elements['p_floor'].focus();
			alert('Isi Floor Name nya');
			return false;
		}
		if (frm.elements['capacity'].value.length==0) {
			frm.elements['capacity'].focus();
			alert('Isi Room Capacity nya');
			return false;
		}
	}
</script>